;(function($){
	function Carousel(carousel){
		var self = this;
		this.carousel = carousel;
		this.setting = {
							"width" : 800,
							"height" : 300,
							"imgWidth" : 600,
							"imgHeight" : 300,
							"scale" : 0.9,
							"speed" : 300,
							"autoPlay" : true,
							"verticalAlign" : "middle",
							"delay" : 500
						};
		this.imgs = this.carousel.find ('li.carousel_item');
		this.firstImg = this.imgs.first();                                 //第一张图片
		this.lastImg = this.imgs.last();                                   //最后一张图片
		this.rotateFlag = true;
		// console.log(this.firstImg);

		$.extend(this.setting,this.getSetting());

		this.setValue();
		this.setPoster();

		//为prev、next按钮绑定click事件
		this.carousel.find('.carousel_control_prev').click(function(){
			if(self.rotateFlag){
				self.carouselRotate('prev');
			}
		});

		this.carousel.find('.carousel_control_next').click(function(){
			if(self.rotateFlag){
				self.carouselRotate('next');
			}
		});
		this.isAutoPlay();

		//鼠标覆盖是停止自动播放，离开时自动播放
		this.carousel.hover(function(){
			clearInterval(self.autoplay);
		},function(){
			self.isAutoPlay();
		})
	}

	Carousel.prototype = {
		//自动播放
		isAutoPlay : function(){
			if(this.setting.autoPlay){
				var self = this;
				self.autoplay = setInterval(function(){
					self.carouselRotate('next')
				},self.setting.delay);
				console.log(self.setting.delay);
			}
		},

		//prev、next按钮的click事件
		carouselRotate : function(direction){
			var _this_ = this,
			zIndexArr = [];
			if(direction === 'prev'){
				console.log(_this_.rotateFlag);
				_this_.imgs.each(function(){
					var self = $(this),
					    prev = self.prev().get(0) ? self.prev() : _this_.lastImg;
					zIndexArr.push(prev.css('zIndex'));
					self.animate({
						width : prev.width(),
						height : prev.height(),
						opacity : prev.css('opacity'),
						left : prev.css('left'),
						top : prev.css('top')
					},_this_.setting.speed,function(){
						_this_.rotateFlag = true;
					});
				})
				_this_.imgs.each(function(i){
					$(this).css('zIndex',zIndexArr[i]);
				})
			}else if(direction === 'next'){
				_this_.imgs.each(function(){
					var self = $(this),
					    next = self.next().get(0) ? self.next() : _this_.firstImg;
					zIndexArr.push(next.css('zIndex'));
					self.animate({
						width : next.width(),
						height : next.height(),
						opacity : next.css('opacity'),
						left : next.css('left'),
						top : next.css('top')
					},_this_.setting.speed,function(){
						_this_.rotateFlag = true;
					});
				})
				_this_.imgs.each(function(i){
					$(this).css('zIndex',zIndexArr[i]);
				})
			}
			_this_.rotateFlag = false;
		},

		//设置左右两边图片的值及位置
		setPoster : function(){
			var imgPoster = this.imgs.slice(1),                                 //除了第一张图片剩余的图片
				imgRight = imgPoster.slice(0,imgPoster.size()/2),               //右边的图片
				imgLeft = imgPoster.slice(imgPoster.size()/2),                  //左边的图片
				firstImgWidth = this.setting.imgWidth,                          //第一张图片的width
				firstImgHeight = this.setting.imgHeight,                        //第一张图片的height
				scale = this.setting.scale,                                     //图片缩放倍数
				firstImgLeft = (this.setting.width - this.setting.imgWidth)/2,  //第一张图片的left
				firstTranslateZ = this.setting.translateZ,                      //第一张图片的translateZ
				_this_ = this;

			//右边图片的相关值
			var rw = firstImgWidth,
				rh = firstImgHeight,
				rgap = ((this.setting.width - firstImgWidth)/2)/imgRight.size(),
				rLevel = imgRight.size();

			//左边图片的相关值
			var lw = firstImgWidth,
				lh = firstImgHeight,
				lgap = ((this.setting.width - firstImgWidth)/2)/imgLeft.size(),
				lLevel = imgLeft.size();

			//设置右边图片的值
			imgRight.each(function(i){
				rw = rw * scale;
				rh = rh * scale;
				$(this).css({
					width : rw,
					height : rh,
					left : firstImgLeft + firstImgWidth + lgap * (i + 1) - rw,
					top :  _this_.setVerticalAlign(rh),
					opacity : 1 / (i + 1),
					zIndex : lLevel--
				})
			});

			//设置左边图片的值
			var n = 0;
			for(var i = imgLeft.size() - 1; i >= 0; i--){
				lw = lw * scale;
				lh = lh * scale;
				$(imgLeft[i]).css({
					width : lw,
					height : lh,
					left : lgap * i,
					top :  _this_.setVerticalAlign(lh),
					opacity : 1 / (n + 1),
					zIndex : i
				});
				n++;
			// console.log(this.setVerticalAlign(lh));
			}
			// this.setVerticalAlign();
		},

		//设置图片垂直对齐方式
		setVerticalAlign : function(height){
			var verticalAlign = this.setting.verticalAlign;
			// console.log(verticalAlign);
			// console.log(this.setting.height - height);
			if(verticalAlign === 'top'){
				return 0;
			}else if(verticalAlign === 'bottom'){
				return this.setting.height - height;
			}else{
				return (this.setting.height - height) / 2;
			}
		},

		//设置基本值
		setValue : function(){
			//设置.carousel高度
			this.carousel.css({
				width : this.setting.width,
				height : this.setting.height
			});

			//设置.carousel_box高度
			$('ul.carousel_box').css({
				width : this.setting.width,
				height : this.setting.height
			});

			//设置.carousel_control的值
			$('.carousel_control').css({
				width : (this.setting.width - this.setting.imgWidth)/2,
				height : this.setting.height
			});

			//设置第一张图片的值
			this.firstImg.css({
				width : this.setting.imgWidth,
				height : this.setting.imgHeight,
				left : (this.setting.width - this.setting.imgWidth)/2,
				zIndex : Math.floor(this.imgs.size() / 2) + 1
			});
		},

		getSetting : function(){
			var setting = this.carousel.attr('data-setting');
			if(setting && setting != ''){
				setting = $.parseJSON(setting);
			}else{
				setting = '';
			}
			return setting;
		}
	};

	Carousel.init = function(carousel){
		var carousels = carousel;
		carousels.each(function(){
			new Carousel($(this));
		});
	}

	window['Carousel'] = Carousel;
})(jQuery);